<%@ Page Language="C#" MasterPageFile="~/MasterPage.master" AutoEventWireup="true"
    CodeFile="07_Customer_Search.aspx.cs" Inherits="_07_Customer_Search" Title="Untitled Page" %>

<%@ Register Assembly="Flan.Controls" Namespace="Flan.Controls" TagPrefix="cc1" %>
<asp:Content ID="Content1" ContentPlaceHolderID="ContentPlaceHolder1" runat="Server">

    <script language="javascript" type="text/javascript">
    <!-- 
    var prm = Sys.WebForms.PageRequestManager.getInstance();
    prm.add_initializeRequest(InitializeRequest);
    prm.add_endRequest(EndRequest);
    var postBackElement;
    function InitializeRequest(sender, args) {
        postBackElement = args.get_postBackElement();
        if ((postBackElement.id == '<%=TextBox1.ClientID%>') 
            || (postBackElement.id == '<%=Button1.ClientID%>')) {
            $get('<%=UpdateProgress1.ClientID%>').style.display = 'block';                
        }
    }
    function EndRequest(sender, args) {
        if ((postBackElement.id == '<%=TextBox1.ClientID%>') 
            || (postBackElement.id == '<%=Button1.ClientID%>')) {
            $get('<%=UpdateProgress1.ClientID%>').style.display = 'none';
        }
    }
    
    // -->
    </script>

    <strong>Get Customer Details&nbsp;</strong><br />
    <span style="font-size: 8pt">Enter few characters of a customer name and hit enter (example
        : ar)</span><br />
    <asp:UpdateProgress ID="UpdateProgress1" runat="server" DisplayAfter="0">
        <progresstemplate>
            <div class="updateProgress">
                <img src="../Resources/Images/indicator.gif" />
                Loading...
            </div>
        </progresstemplate>
    </asp:UpdateProgress>
    <asp:TextBox ID="TextBox1" runat="server" Width="150px"></asp:TextBox>&nbsp;<asp:Button
        ID="Button1" runat="server" OnClick="Button1_Click" Text="Search" />
    <asp:RegularExpressionValidator ID="RegularExpressionValidator1" runat="server" ErrorMessage="Minimum of 2 characters required!"
        ControlToValidate="TextBox1" Display="Dynamic" ValidationExpression=".{2,}"></asp:RegularExpressionValidator>
    <asp:RequiredFieldValidator ID="RequiredFieldValidator1" runat="server" ErrorMessage="Required!"
        ControlToValidate="TextBox1" Display="Dynamic"></asp:RequiredFieldValidator>
    <!--------------UpdatePanelPopupExtender-------------------------->
    <cc1:UpdatePanelPopupExtender ID="UpdatePanelPopupExtender1" runat="server" TargetControlID="UpdatePanel1"
        OffsetX="0" HorizontalAlign="Left" VerticalAlign="Bottom" />
    <!--------------UpdatePanelPopupExtender-------------------------->
    <div style="display: none">
        <asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="Conditional" ChildrenAsTriggers="false">
            <contenttemplate>
            <asp:Panel runat="Server" ID="pnl1" BackColor="lightblue">
                <div>
                    &nbsp;<asp:Label ID="Label1" runat="server" Width="200px" Height="20px"></asp:Label>
                    <div id="divClose" runat="server" class="closeIcon">
                    </div>
                </div>
                <asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="False" DataKeyNames="CustomerID"
                    DataSourceID="SqlDataSource1" CellPadding="4" ForeColor="#333333" GridLines="Vertical"
                    OnRowCreated="GridView1_RowCreated" AllowPaging="True" PageSize="6" OnRowCommand="GridView1_RowCommand"
                    EnableViewState="False">
                    <Columns>
                        <asp:TemplateField ShowHeader="False">
                            <ItemTemplate>
                                <asp:LinkButton ID="LinkButton1" runat="server" CausesValidation="False" CommandName="Select"
                                    Text="Select"></asp:LinkButton>
                            </ItemTemplate>
                        </asp:TemplateField>
                        <asp:BoundField DataField="ContactName" HeaderText="ContactName" SortExpression="ContactName" />
                        <asp:BoundField DataField="CompanyName" HeaderText="CompanyName" SortExpression="CompanyName" />
                    </Columns>
                    <FooterStyle BackColor="#5D7B9D" Font-Bold="True" ForeColor="White" />
                    <RowStyle BackColor="#F7F6F3" ForeColor="#333333" />
                    <EditRowStyle BackColor="#999999" />
                    <PagerStyle BackColor="#284775" ForeColor="White" HorizontalAlign="Left" />
                    <HeaderStyle BackColor="#5D7B9D" Font-Bold="True" ForeColor="White" />
                    <AlternatingRowStyle BackColor="White" ForeColor="#284775" />
                </asp:GridView>
                <asp:SqlDataSource ID="SqlDataSource1" runat="server" ConnectionString="<%$ ConnectionStrings:NorthwindConnectionString %>"
                    SelectCommand="SELECT [CompanyName], [ContactName], [CustomerID] FROM [Customers] WHERE ([ContactName] LIKE '%' + @ContactName + '%')"
                    OnSelected="SqlDataSource1_Selected">
                    <SelectParameters>
                        <asp:ControlParameter ControlID="TextBox1" Name="ContactName" PropertyName="Text"
                            Type="String" />
                    </SelectParameters>
                </asp:SqlDataSource>
            </asp:Panel>
        </contenttemplate>
        </asp:UpdatePanel>
    </div>
    <asp:UpdatePanel ID="UpdatePanel2" runat="server" ChildrenAsTriggers="False" UpdateMode="Conditional">
        <contenttemplate>
<asp:DetailsView id="DetailsView1" runat="server" DataSourceID="SqlDataSource2" Width="278px" ForeColor="#333333" CellPadding="4" DataKeyNames="CustomerID" HeaderText="Customer Details" AutoGenerateRows="False">
<FooterStyle BackColor="#990000" ForeColor="White" Font-Bold="True"></FooterStyle>

<CommandRowStyle BackColor="#FFFFC0" Font-Bold="True"></CommandRowStyle>

<RowStyle BackColor="#FFFBD6" ForeColor="#333333"></RowStyle>

<PagerStyle BackColor="#FFCC66" ForeColor="#333333" HorizontalAlign="Center"></PagerStyle>
<Fields>
<asp:BoundField ReadOnly="True" DataField="CustomerID" SortExpression="CustomerID" HeaderText="CustomerID"></asp:BoundField>
<asp:BoundField DataField="CompanyName" SortExpression="CompanyName" HeaderText="CompanyName"></asp:BoundField>
<asp:BoundField DataField="ContactName" SortExpression="ContactName" HeaderText="ContactName"></asp:BoundField>
<asp:BoundField DataField="ContactTitle" SortExpression="ContactTitle" HeaderText="ContactTitle"></asp:BoundField>
<asp:BoundField DataField="Address" SortExpression="Address" HeaderText="Address"></asp:BoundField>
<asp:BoundField DataField="City" SortExpression="City" HeaderText="City"></asp:BoundField>
<asp:BoundField DataField="Region" SortExpression="Region" HeaderText="Region"></asp:BoundField>
<asp:BoundField DataField="PostalCode" SortExpression="PostalCode" HeaderText="PostalCode"></asp:BoundField>
<asp:BoundField DataField="Country" SortExpression="Country" HeaderText="Country"></asp:BoundField>
<asp:BoundField DataField="Phone" SortExpression="Phone" HeaderText="Phone"></asp:BoundField>
<asp:BoundField DataField="Fax" SortExpression="Fax" HeaderText="Fax"></asp:BoundField>
</Fields>

<FieldHeaderStyle BackColor="#FFFFC0" Font-Bold="True"></FieldHeaderStyle>

<HeaderStyle BackColor="#990000" ForeColor="White" Font-Bold="True"></HeaderStyle>

<AlternatingRowStyle BackColor="White"></AlternatingRowStyle>
</asp:DetailsView> 
</contenttemplate>
        <triggers>
<asp:AsyncPostBackTrigger ControlID="GridView1" EventName="SelectedIndexChanged"></asp:AsyncPostBackTrigger>
</triggers>
    </asp:UpdatePanel>
    <asp:SqlDataSource ID="SqlDataSource2" runat="server" ConnectionString="<%$ ConnectionStrings:NorthwindConnectionString %>"
        SelectCommand="SELECT [CustomerID], [CompanyName], [ContactName], [ContactTitle], [Address], [City], [Region], [PostalCode], [Country], [Phone], [Fax] FROM [Customers] WHERE ([CustomerID] = @CustomerID)">
        <SelectParameters>
            <asp:ControlParameter ControlID="GridView1" Name="CustomerID" PropertyName="SelectedValue"
                Type="String" />
        </SelectParameters>
    </asp:SqlDataSource>
</asp:Content>
<asp:Content ID="Content2" runat="server" ContentPlaceHolderID="ContentPlaceHolder2">
    <ul>
        <li>UpdatePanel2 is set to refresh anytime the SelectedIndex of GridView1 changes. </li>
        <li>We have used the static method UpdatePanelPopupExtender.RegisterCloseControl on
            the "Select" link so UpdatePanel1 gets hidden
            on click.</li></ul>
</asp:Content>
